<template>
	<view>
		<view class="dd-head">
			<view :class="asitemindex==index?'dd-sitem':'dd-item'" v-for="(item,index) in answer" :key="index"
				@tap="asitembtn(index)">
				<text>{{item}}</text>
			</view>
		</view>
		<!-- 自提 -->
		<view class="pick" v-show="asitemindex==0">
			<view class="pick_now">
				<text class="pick_now_title">当前位置</text>
				<view class="pick_now_right">
					<text class="pick_now_right_city" @click="onAuthorize">{{city || '定位失败,稍后点击重试'}}</text>
					<!-- <text @tap="selectSite" class="pick_now_right_select">选择您自提的地点</text> -->
				</view>
			</view>
			<view class="pick_consignee">
				<text class="pick_consignee_title">收货人</text>
				<view class="pick_consignee_right" @tap="selectSite">
					<view class="pick_consignee_right_left">
						<text v-show="name" class="pick_consignee_right_left_name">{{name}}</text>
						<text v-show="name" class="pick_consignee_right_left_number">{{phone}}</text>
						<text class="pick_consignee_right_left_name" v-show="!name">请填写收货人信息</text>
					</view>
					<image class="pick_consignee_right_image" src="/static/my/right.png" mode=""></image>
				</view>
			</view>
			<view class="pick_list" v-for="(pitem,pindex) in pickList" :key="pindex">
				<view class="pick_list_left">
					<view class="pick_list_left_top">
						<text class="pick_list_left_top_shop">上云丰</text>
						<text class="pick_list_left_top_name">{{pitem.storeName}}</text>
					</view>
					<text class="pick_list_left_site">{{pitem.address}}</text>
				</view>
				<!-- <radio color="#077840" /> -->
				<!-- <image class="pick_list_image" src="/static/image/13.png" mode=""></image> -->
			</view>
			<!-- <view class="pick_btn" >确认选择</view> -->
		</view>
		<!-- 快递 -->
		<view class="express" v-show="asitemindex==1">
			<view class="express_empty" @tap='addSite'>
				<image class="express_empty_image" src="/static/my/add.png" mode=""></image>
				<text class="express_empty_write">添加新地址</text>
			</view>
			<!-- <view class="express_default">
				<view class="express_default_msg">
					<view class="express_default_msg_tag">默认</view>
					<text class="express_default_msg_name">黄小浩</text>
					<text class="express_default_msg_number">1398380380</text>
				</view>
				<text class="express_default_site">牛顿公园虎踞北路89号749室</text>
			</view> -->
			<view class="express_list" v-for="(aitem,aindex) in addressList" :key="aindex">
				<view class="express_list_left" @tap="onOrderDetail(aitem)">
					<view class="express_list_left_top">
						<view class="express_default_msg_tag" v-if="aitem.defaultFlag==1">默认</view>
						<text class="express_list_left_top_name">{{aitem.name}}</text>
						<text class="express_list_left_top_number">{{aitem.phone}}</text>
					</view>
					<text class="express_list_left_site">{{aitem.provinceName + aitem.cityName + aitem.regionName + aitem.detail}}</text>
				</view>
				<view class="express_list_right" @tap="editUp(aitem)">
					<image class="express_list_right_image" src="/static/my/bianji@2x.png" mode=""></image>
					<text class="express_list_right_edit">编辑</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	// import '@/common/amap-wx.js';
	export default {
		data() {
			return {
				answer: ['自提', '快递'],
				asitemindex: 0, //0是自提
				pickList: [],
				addressList: [],
				city: '',
				vauleC: false,
				name: '',
				phone: '',
				source:''
			}
		},
		onShow(){
			if(this.asitemindex == 0){
				this.getAddressLists(1)
			}else{
				this.getAddressLists(0)
			}
		},
		onLoad(e) {
			console.log(e,'source=order')
			const { source } = e;
			if(source && source == 'order'){
				//下订单调整过来的页面参数
				this.source = source;
				this.asitemindex = 1;
				this.getAddressLists(0)
				this.answer = ['快递']
			}else{
			
			this.answer = ['自提', '快递']
			// 获取当前位置 去掉定位
			// this.onAuthorize();
			// 默认显示自提地址
			this.getAddressLists(1)
			uni.$on('upAddress', () => {
				if(this.asitemindex == 0){
					this.getAddressLists(1)
				}else{
					this.getAddressLists(0)
				}
			})
			uni.$on('getPicka', (data) => {
				console.log(data);
			})
			uni.$on('takePerson', (data) => {
				console.log(data,'takePerson')
				this.asitemindex == 0
				this.getAddressLists(1)
				
			})
			
		
			}
		},
		methods: {
			/**
			 * 授权启用定位权限
			 */
			onAuthorize() {
				let self = this;
				uni.openSetting({
					success(res) {
						if (res.authSetting["scope.userLocation"]) {
							console.log('授权成功');
							self.isAuthor = true;
							setTimeout(() => {
								// 获取用户坐标
								self.getLocation()
							}, 1000);
						}
					}
				})
			},
			// 获取默认自提地址list selfFlag 是否自提(0：否，1：是)
			getAddressLists(selfFlag){
				let self = this;
				uni.showLoading({
					title: '加载中'
				});
				self._get('user/address/lists', {
					selfFlag
				}, function(res) {
					const { data } = res;
					console.log(data,'1234654')
					self.name = data.selfList && data.selfList.name
					self.phone = data.selfList && data.selfList.phone
					if(self.asitemindex == 0 && data.selfList){
						// 自提
						self.pickList = data.selfList.selfStores
					}else{
						self.addressList  = data.expressList
					}
					uni.hideLoading();
				});
			},
			getLocation() {
				// 获取当前定位信息
					uni.getLocation({
					// gcj02 返回国测局坐标（App 和 H5 需配置定位 SDK 信息才可支持 gcj02。）
					type: 'gcj02', 
					// 是否解析地址信息（仅App平台支持（安卓需指定 type 为 gcj02 并配置三方定位SDK））
					geocode: true, 
					success: function(res) {
						console.log(res,'详情地址');
						const { address } = res;
						this.city = address.province + address.city;
					}
				});
				
			},
			
			// 跳转到编辑
			editUp(item) {
				console.log(item);
				uni.navigateTo({
					url: '/userpage/address/editAddress?value=' + JSON.stringify(item)
				})
			},
			// 跳到订单页面
			onOrderDetail(item){
				if(this.source && this.source == 'order'){
					uni.setStorageSync('orderAddress',JSON.stringify(item)) 
					uni.navigateBack();
					
				}
			},
			func(c, v) {
				// console.log(12);
				let on = ''
				let cns = c.split(',').map(item => {
					on = on + item
				})
				on = on + v
				return on
			},
			asitembtn(index) {
				this.asitemindex = index;
				if(index== 0){
					this.getAddressLists(1)
				}else{
					this.getAddressLists(0)
				}
			},
			// 添加新的收货地址
			addSite() {
				uni.navigateTo({
					url: '/orderpages/addressAdd/addressAdd'
				})
			},
			// 选择您自提的地点
			selectSite() {
				uni.navigateTo({
					url: '/userpage/address/pickAffirm'
				})
			}
		}
	}
</script>

<style lang="less">
	page {
		background-color: #F9F9F9;
	}

	// 切换的
	.dd-head {
		display: flex;
		justify-content: space-around;
		padding: 0rpx 54rpx;
		line-height: 84rpx;
		// border-bottom: 1px solid rgba(238,238,238,1);
		position: -webkit-sticky;
		position: sticky;
		top: var(--window-top);
		z-index: 99;
		// background: #FFFFFF;
	}

	.dd-sitem {
		font-size: 34rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 500;
		line-height: 84rpx;
		color: #077840;
		border-bottom: 4rpx solid #077840;
		// width: 50%;
		text-align: center;
	}

	.dd-item {
		font-size: 34rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #333333;
		line-height: 84rpx;
		// width: 50%;
		text-align: center;
	}

	.pick {
		margin-top: 20rpx;

		// background-color: #FFFFFF;
		&_now {
			background-color: #FFFFFF;
			padding: 30rpx;
			border-bottom: 2rpx solid #EEEEEE;
			display: flex;
			justify-content: space-between;
			align-items: center;

			&_title {
				width: 120rpx;
				// height: 40rpx;
				font-size: 28rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #999999;
				line-height: 40rpx;

			}

			&_right {
				flex: 1;
				display: flex;
				justify-content: space-between;
				margin-left: 20rpx;

				&_city {
					// width: 56rpx;
					// height: 40rpx;
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;
					line-height: 40rpx;

				}

				&_select {
					// width: 224rpx;
					// height: 40rpx;
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #999999;
					line-height: 40rpx;

				}
			}
		}

		&_consignee {
			background-color: #FFFFFF;
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 30rpx;

			&_title {
				width: 120rpx;
				// height: 40rpx;
				font-size: 28rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #999999;
				line-height: 40rpx;

			}

			&_right {
				flex: 1;
				margin-left: 20rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;

				&_left {
					display: flex;
					align-items: center;

					&_name {
						// width: 84rpx;
						// height: 40rpx;
						font-size: 28rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #333333;
						line-height: 40rpx;

					}

					&_number {
						margin-left: 30rpx;
						// width: 164rpx;
						// height: 40rpx;
						font-size: 28rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #333333;
						line-height: 40rpx;

					}
				}

				&_image {
					width: 12rpx;
					height: 20rpx;

				}
			}
		}

		&_list {
			margin-top: 20rpx;
			padding: 30rpx;
			display: flex;
			align-items: center;
			background-color: #FFFFFF;

			&_left {
				flex: 1;
				display: flex;
				flex-direction: column;

				&_top {
					display: flex;
					align-items: center;

					&_shop {
						width: 92rpx;
						height: 48rpx;
						background: #077840;
						border-radius: 4rpx;
						// width: 72rpx;
						// height: 34rpx;
						font-size: 24rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #FFFFFF;
						line-height: 48rpx;
						text-align: center;

					}

					&_name {
						margin-left: 20rpx;
						// width: 150rpx;
						// height: 42rpx;
						font-size: 30rpx;
						font-family: PingFangSC-Medium, PingFang SC;
						font-weight: 500;
						color: #333333;
						line-height: 42rpx;

					}
				}

				&_site {
					// width: 338rpx;
					// height: 40rpx;
					margin-top: 20rpx;
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;
					line-height: 40rpx;

				}
			}

			&_image {
				width: 40rpx;
				height: 40rpx;
				// background: #077840;

			}
		}

		&_btn {
			width: 630rpx;
			height: 96rpx;
			background: #077840;
			border-radius: 8rpx;
			// width: 128rpx;
			// height: 44rpx;
			font-size: 32rpx;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			line-height: 96rpx;
			text-align: center;
			margin: 30rpx auto 0;
		}
	}

	.express {
		&_empty {
			background-color: #FFFFFF;
			display: flex;
			padding: 30rpx;
			align-items: center;

			&_image {
				width: 28rpx;
				height: 28rpx;
				// background: #333333;

			}

			&_write {
				margin-left: 20rpx;
				width: 168rpx;
				height: 40rpx;
				font-size: 28rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #333333;
				line-height: 40rpx;

			}
		}

		&_default {
			background-color: #FFFFFF;
			padding: 30rpx;
			margin-top: 20rpx;

			&_msg {
				display: flex;
				align-items: center;

				&_tag {
					width: 80rpx;
					height: 48rpx;
					background: #077840;
					border-radius: 4rpx;
					// width: 48rpx;
					// height: 34rpx;
					font-size: 24rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #FFFFFF;
					line-height: 48rpx;
					text-align: center;
					margin-right: 20rpx
				}

				&_name {
					// width: 90rpx;
					// height: 42rpx;
					margin: 0 30rpx 0 20rpx;
					font-size: 30rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #333333;
					line-height: 42rpx;

				}

				&_number {
					width: 164rpx;
					height: 40rpx;
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;
					line-height: 40rpx;

				}
			}

			&_site {
				// width: 364rpx;
				// height: 40rpx;
				margin-top: 20rpx;
				font-size: 28rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #333333;
				line-height: 40rpx;

			}
		}

		&_list {
			background-color: #FFFFFF;
			padding: 30rpx;
			display: flex;
			justify-content: space-between;
			margin-top: 20rpx;

			&_left {
				flex: 1;

				&_top {
					display: flex;
					align-items: center;

					&_tag {
						width: 80rpx;
						height: 48rpx;
						background: #077840;
						border-radius: 4rpx;
						// width: 48rpx;
						// height: 34rpx;
						font-size: 24rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #FFFFFF;
						line-height: 48rpx;
						text-align: center;
						margin-right: 20rpx;
					}

					&_name {
						// width: 90rpx;
						// height: 42rpx;
						font-size: 30rpx;
						font-family: PingFangSC-Medium, PingFang SC;
						font-weight: 500;
						color: #333333;
						line-height: 42rpx;
						margin: 0 30rpx 0 0;
					}

					&_number {
						// width: 164rpx;
						// height: 40rpx;
						// margin-left: 30rpx;
						font-size: 28rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #333333;
						line-height: 42rpx;

					}
				}

				&_site {
					// width: 364rpx;
					// height: 40rpx;
					margin-top: 20rpx;
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;
					line-height: 40rpx;

				}
			}

			&_right {
				display: flex;
				align-items: center;

				&_image {
					width: 30rpx;
					height: 32rpx;
					// background: #999999;

				}

				&_edit {
					flex: 1;
					// width: 52rpx;
					// height: 36rpx
					margin-left: 20rpx;
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #999999;
					line-height: 36rpx;

				}
			}
		}
	}
</style>